<h3>Dialogs</h3>
The most frequent dialogs are alert, confirm and prompt. In the case of an alert you just need to display a message to the user
and require no feedback besides user acknowledgement. Confirm dialog has similar purpose, but expects from the user a response
by accepting or declining the message. Prompt waits for user input. The w2ui library includes these dialogs for your convenience.
<div style="height: 20px"></div>

<h4>w2alert(msg, [title], [callBack])</h4>

The alert dialog can be called in the following way:

<textarea class="javascript">
w2alert('This is an alert')
</textarea>

First argument, msg, is a message to display. Second optional argument, title, is the title for the dialog. The third optional argument,
callBack, is a call back function when dialog is closed.
<div style="height: 20px"></div>

<textarea class="javascript">
w2alert('This is an alert')
    .ok(function () {
        // call back when alert closed
    })
</textarea>


<h4>w2confirm (msg, [title], [callBack])</h4>

The confirm dialog can be called in the following way:

<textarea class="javascript">
w2confirm('Are you sure?')
    .yes(() => {
        console.log('Yes')
    })
    .no(() => {
        console.log('Yes')
    })
// OR
w2confirm('Are you sure?', function btn(answer) {
    console.log(answer); // Yes or No -- case-sensitive
})
</textarea>

The method takes up to three arguments <span class="method">w2confirm(msg, [title], [callBack])</span>, where msg is the message to display. You can optionally supply title for the message and a call back function.
<div style="height: 20px"></div>

<h4>w2confirm(options)</h4>

You can optionally call w2confirm passing an object with options. This options object has following structure:

<textarea class="javascript">
options = {
    msg: '',
    title: 'Confirmation',
    width: 450,        // width of the dialog
    height: 220,       // height of the dialog
    btn_yes: {
        text: 'Yes',   // text for yes button (or yes_text)
        class: '',     // class for yes button (or yes_class)
        style: '',     // style for yes button (or yes_style)
        onClick: null  // callBack for yes button (or yes_callBack)
    },
    btn_no: {
        text: 'No',    // text for no button (or no_text)
        class: '',     // class for no button (or no_class)
        style: '',     // style for no button (or no_style)
        onClick: null  // callBack for no button (or no_callBack)
    },
    callBack: null,    // common callBack
    onOpen: null,      // event when popup is opened
    onClose: null      // event when popup is closed
};
</textarea>

For convenience, w2confirm will return to you an object with yes() and no() methods that you can use in the following way:
<textarea class="javascript">
w2confirm('Are you sure?')
    .yes(function () {
        console.log('user clicked YES');
    })
    .no(function () {
        console.log("user clicked NO")
    });
</textarea>


<h4>w2prompt(label, [title], [callBack])</h4>

Prompts user to enter value. Instead of passing label, title, and callBack, you can call w2prompt in the following way:

<textarea class="javascript">
w2prompt({
        label: 'Enter value',
        value: '0',
        attrs: 'size=6'
    })
    .change(function () {
        console.log('Input value changed.');
    })
    .ok(function () {
        console.log("User clicked ok.")
    });
</textarea>

<h4>w2prompt(options)</h4>

Following properties are supported:

<textarea class="javascript">
options = {
    title: 'Notification', // title of dialog
    width: 400,            // width of the dialog
    height: 220,           // height of dialog
    label: '',             // label for the input control
    value: '',             // initial value of input
    attrs: '',             // attributes for input control
    btn_ok: {
        text  : 'Ok', // text for ok button (or ok_text)
        class : '',    // class for ok button (or ok_class)
        style : '',    // style for ok button (or ok_style)
        click : null   // callBack for ok button (or ok_callBack)
    },
    btn_cancel: {
        text  : 'Cancel', // text for cancel button (or cancel_text)
        class : '',    // class for cancel button (or cancel_class)
        style : '',    // style for cancel button (or cancel_style)
        click : null   // callBack for cancel button (or cancel_callBack)
    },
    callBack: null         // callBack function, if any
    onOpen: null,          // event when popup is opened
    onClose: null          // event when popup is closed
}
</textarea>
